<template>
	<view class="usermsg initbox">
		<view class="usermsgcon flexm" @click="linkLoginYes">
			<view class="userhead">
				<image class='auto-img' :src="userinfo.headI" mode=""></image>
			</view>
			<view class="" v-if="isLogin">
				<view class="username">
					{{userinfo.username}}
				</view>
				<view class="userpwd">{{userinfo.userpwd}}</view>
			</view>
			<view class="sign" v-else>
				去登录
			</view>
		</view>
		<view class="news flexm" @click="lftit('/pages/my/coupon')">
			<view class="newstext">
				<image src="../../static/my/yhj.png" mode=""></image>
				<text>我的优惠卷</text>
			</view>
			<view class="newsign">

				<text>{{userinfo.newsign}}</text>
				<image src="../../static/fan.png" mode=""></image>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				show:false,
				userinfo:{
					headI:'',	
					username:'张三',
					userpwd:'13213123213',
					newsign:'12张'
				}
			}
		},
		created() {
			if (uni.getStorageSync("openid") != "") {
				this.isLogin = true;
				let info = uni.getStorageSync("userinfo");
				this.userinfo.username = info.nickName;
				this.userinfo.headI = info.avatarUrl;
			}
		},
		methods: {
			linkLoginYes() {
				if (this.isLogin === false) {
					this.goSign()
				} else {
					this.lftit("/pages/setting/tiedot")
				}
			},
			lftit(url) {
				uni.navigateTo({
					url: url
				})
			},
			goSign() {
				uni.navigateTo({
					url: '/pages/sign/sign'
				})
			},
			appLoginWx() {
				let _this = this;
				// #ifdef MP-WEIXIN
				uni.getProvider({
					service: 'oauth',
					success: function(res) {
						if (~res.provider.indexOf('weixin')) {
							uni.login({
								provider: 'weixin',
								success: (res2) => {
									_this.getOpenId(res2.code)
									uni.getUserInfo({
										provider: 'weixin',
										success: (info) => { //这里请求接口
											console.log(res2);
											console.log(info);
											uni.setStorageSync("userinfo", info.userInfo);
											_this.goSign();
										},
										fail: () => {
											uni.showToast({
												title: "微信登录授权失败",
												icon: "none"
											});
										}
									})
								}
							})

						} else {
							uni.showToast({
								title: '请先安装微信或升级版本',
								icon: "none"
							});
						}
					}
				});
				//#endif
			},
			getOpenId(js_code) {
				uni.request({
					url: "https://api.weixin.qq.com/sns/jscode2session?appid=wx644b99d40db937f0&secret=6a931ac5342fe31ad5dca806389a81ee&js_code=" +
						js_code,
					header: {
						"Content-type": "application/x-www-form-urlencoded"
					},
					method: "POST",
					success: data => {
						console.log(data.data);
						uni.setStorageSync("openid", data.data.openid);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.usermsg {
		height: 360rpx;
		margin-bottom: 57rpx;
		background: #FD91A2;
		color: #FFFFFF;
		position: relative;
	}

	.usermsgcon {
		width: 100%;
		padding: 56rpx 0 0 0;
		position: relative;
		align-items: center;
		justify-content: center;
		text-align: center;

		.userhead {
			width: 100%;
			border-radius: 50rpx;
			overflow: hidden;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 120rpx;
				height: 120rpx;
				border-radius: 60rpx;
				overflow: hidden;
			}
		}

		.username {
			margin-top: 20rpx;
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
		}

		.userpwd {
			margin-top: 18rpx;
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: rgba(255, 255, 255, 1);
		}

		.sign {
			display: inline-block;
			padding: 5rpx 15rpx;
			margin-top: 25rpx;
			border-radius: 30rpx;
			background-color: #FFFFFF;
			color: #E0636F;
		}
	}

	.news {
		padding: 27rpx 26rpx;
		width: 95%;
		margin: auto;
		box-shadow: 0 8rpx 8rpx 0 rgba(51, 51, 51, 0.15);
		border-radius: 16rpx;
		background: #FFFFFF;
		justify-content: flex-start;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		transform: translateY(50%);
		color: #333333;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.newstext {
			font-size: 26rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: rgba(40, 40, 40, 1);
			width: 100%;
			position: relative;
			display: flex;
			align-items: center;


			image {
				width: 36rpx;
				height: 34rpx;
			}

			text {
				margin-left: 14rpx;
			}
		}

		.newsign {
			font-size: 22rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: rgba(163, 163, 163, 1);
			width: 16%;
			display: flex;
			align-items: center;
			justify-content: space-between;

			image {
				width: 8rpx;
				height: 16rpx;
			}
		}
	}
</style>
